<%@page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"
	trimDirectiveWhitespaces="true"%>
<!-- 태그 라이브러리 통해 JDBC접속 -->
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="sql" uri="http://java.sun.com/jsp/jstl/sql"%>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<!-- sql문 등록 -->
<!-- list.jsp?cpage=1 -->
<!-- list.jsp?cpage=2 -->
<!-- list.jsp?cpage=3 -->
<!-- 현재 페이지 처리 -->
<c:set var="cpage" value="1" />
<c:if test="${not empty param.cpage }">
	<c:set var="cpage" value="${param.cpage}" />
</c:if>
<%--페이지 단위로 게시판 리스트 가져오기 
	오라클의 rank 분석 함수를 이용함(쉬움)
	오라클의 rownum을 이용하면 성능이 좋아짐(어려움)--%>
<sql:query var="rs" dataSource="jdbc/oracle11xe">
	select * 
	from (
			select bdno, bdtitle, userid, regdate, reads, ceil(dense_rank()over(order by bdno desc)/15) page
			from board)
			where page = ?
<sql:param value="${cpage}" />
</sql:query>
<%-- 총 페이지 수를 계산하는 SQL 질의 --%>
<sql:query var="rs2" dataSource="jdbc/oracle11xe">
	select ceil(count(bdno)/15)as pages from board
</sql:query>
<%--총 페이지 수를 계산하는 SQL쿼리문을 읽어온 후 그 값을 pages라는 변수에 담음.--%>
<c:forEach var="r2" items="${rs2.rows}">
	<c:set var="pages" value="${r2.pages}" />
</c:forEach>

<!--로그인 여부에 따라 "새글쓰기 버튼이나 "로그인하세요"라는 안내문구를 출력하는 코드 작성 -->
<c:if test="${not empty sessionScope.login}">
	<c:set var="loginResult">
		<button type="button" id="newBtn">새글쓰기</button>
	</c:set>
</c:if>

<c:if test="${empty sessionScope.login}">
	<c:set var="loginResult">
		<em class="danger">로그인하세요!!!</em>
	</c:set>
</c:if>

<link href="css/jech913.css" rel="stylesheet">
<style type="text/css">
/*테이블 정렬 및 색상*/
table {
	width: 75%;
	margin: 0 auto;
	border-collapse: collapse;
	/*내용에 따라 테이블너비가 변하는 것을 방지 
	   단점: 각 열의 너비가 균등너비로 고정
	   해결: colgroup태그로 각 열 너비 재 설정*/
	table-layout: fixed;
	/*테이블 하단에 여백 지정 */
	margin-bottom: 45px;
}

th, td {
	border: 1px solid black;
	text-align: center;
	padding: 10px;
}
/* 1행 클래스(bdtitle) 지정 */
.tdtitle {
	/* 자동 줄 바꿈 금지 - 한 줄로 출력 */
	white-space: nowrap;
	/* 영역 밖 넘친 문자를 숨김으로 처리*/
	overflow: hidden;
	/* 넘어간 부분을 ...(ellipsis)로 처리(문자 줄임)*/
	text-overflow: ellipsis;
}

/*페이징*/
.pgnav {
	width: 500px;
	height: 35px;
	margin: 25px auto;
}

.pgnav li {
	display: inline;
	padding-right: 20px;
}

.cpage {
	font-size: 200%;
	color: red;
	font-weight: bold;
}

#search {
	width: 75%;
	margin: 0 auto;
	padding-bottom: 10px;
}

#search span {
	display: inline-block;
	width: 42%;
}

#search span:last-child {
	text-align: right;
	margin-left: 111px;
}
</style>



	<div id="contents">
		<h2>게시판</h2>
		<div id="search">
			<span> <select>
					<option>제목</option>
					<option>작성자</option>
					<option>본문</option>
			</select> <input type="text" name="key" />
				<button type="button">검색</button>
			</span> 
			<span> <!-- <button type="button" id="newBtn">새글쓰기</button> -->
				${loginResult}
			</span>
		</div>
		<table>
			<!-- 테이블 열 수와 너비 설정 -->
			<colgroup>
				<col style="width: 10%" />
				<col style="" />
				<col style="width: 15%" />
				<col style="width: 20%" />
				<col style="width: 10%" />
			</colgroup>

			<thead>
				<tr>
					<!-- 제목 행 출력 -->
					<th>번호</th>
					<th>제목</th>
					<th>작성자</th>
					<th>작성일</th>
					<th>조회</th>
				</tr>
			</thead>
			<tbody>
				<c:forEach var="r" items="${rs.rows}">
					<!-- 본문 행 출력 -->
					<tr>
						<td>${r.bdno}</td>
						<td class="tdtitle"><a href="../board/view.jsp?bdno=${r.bdno}">${r.bdtitle}</a></td>
						<td>${r.userid}</td>
						<!-- 날짜 10개만 보이도록 잘라냄 -->
						<td>${fn:substring(r.regdate,0,10)}</td>
						<td>${r.reads}</td>
					</tr>
				</c:forEach>
			</tbody>
		</table>

		<ul class="pgnav">
			<li><a href="list.jsp?cpage=1">맨처음</a></li>
			<c:if test="${cpage gt 1}">
				<li><a href="../board/list.jsp?${cpage-1}">이전</a></li>
			</c:if>

			<c:forEach var="i" begin="1" end="${pages}">
				<!-- 링크를 만드는 코드 -->
				<%--현재 페이지가 i와 같다면 링크제거 후 출력--%>
				<c:if test="${i eq cpage}">
					<li class="cpage">${i}</li>
				</c:if>
				<!-- 링크를 만들지 않은 코드 -->
				<%--현재 페이지가 i와 다르다면 링크로 출력 --%>
				<c:if test="${i ne cpage}">
					<li><a href="../board/list.jsp?cpage=${i}">${i}</a></li>

				</c:if>
			</c:forEach>
			<c:if test="${cpage lt pages}">
				<li><a href="../board/list.jsp?cpage=${cpage+1}">다음</a></li>
			</c:if>
			<li><a href="../board/list.jsp?cpage=${pages}">맨끝</a></li>
		</ul>

	</div>

	<script src="js/jquery-1.11.1.min.js"></script>
	<script src="js/jech913.js"></script>
